// import { template } from "handlebars";

// import { get } from "http";

$(function() {
    var url = window.location.href;
    
    var index = url.indexOf('?');
    
    var len = url.substring(index + 1);
    
    var arr = len.split('=');
    
    console.log(arr[1]);
    var ids=arr[1];

    var kunum=0;

    var selectSize=-1;

    $.ajax({
        url: '/product/queryProductDetail',
        type:'get',
        data: {
            id: ids
        },
        success:function(res) {
            console.log(res);

            kunum=res.num;
            
            var size=res.size;
            console.log(size);
            var sizeArr=size.split('-');
            console.log(sizeArr);
            var start=sizeArr[0];
            var end=sizeArr[1];
            var resArr=[];
            for(var i=start;i<=end;i++) {
                console.log(i);
                resArr.push(i);
            }
            // console.log(resArr);
            // 重写size 把字符串变成成数组
            res.size=resArr;
            // console.log(res);
            
            var htmls=template('detailTmp',res);
            $('#myDetail').html(htmls);
        }
    })

    // $('#reduce').on('tap',function() {
    //     // alert(1)
    //     var val=parseInt($('#productNum').val());
    //     val--;
    //     if(val<0) {
    //         val=0
    //     }
    // })
    // $('#add').on('tap',function() {
    //     // alert(1)
    //     var val=parseInt($('#productNum').val());
    //     val++;
    //     if(val>kunum) {
    //         val=kunum;
    //     }
    // })

    // 注意事项 这里需要使用事件代理的方法进行绑定 因为是动态生成的数据

    $('#myDetail').on('tap','#reduce',function() {
        // alert(1)
        var val=parseInt($('#productNum').val());
        val--;
        if(val<0) {
            val=0
            alert('已经不能再减少了')
        }
        // 重新赋值
        $('#productNum').val(val);
    })

    $('#myDetail').on('tap','#add',function() {
        // alert(1)
        var val=parseInt($('#productNum').val());
        val++;
        if(val>kunum) {
            val=kunum;
            alert('已经不能再增加了')
        }
        $('#productNum').val(val);
    })

    /**
     * 1 点击尺码 当前高亮
     */


    $('#myDetail').on('tap','.detail-size span',function() {
        // alert(1)
        $(this).addClass('active').siblings().removeClass('active');
        selectSize=$(this).html();
        console.log(selectSize);
        
    })


    /**
     * 加入购物车
     * 1 给购物车按钮绑定点击事件
     * 2 获取需要绑定的参数 尺码 id 选择的数量
     * 3 判断
     * 4 发送ajax 请求
     */
    $('#myDetail').on('tap','#addCar',function() {
        // alert(1)

        var selectNum=$('#productNum').val();
        if(selectSize==-1) {
            alert('请选择你需要的尺码');
            return;
        }

        $.ajax({
            url: '/cart/addCart',
            type: 'post',
            data: {
                productId: ids,
                num: selectNum,
                size: selectSize
            },
            success:function(res) {
                console.log(res);
                if(res.success) {
                    mui.toast('加入购物车成功');
                    setTimeout(function() {
                        window.location.href='cart.html';
                    },2000);
                }else {
                    alert('添加失败,请查看是否已登录')
                    mui.toast('添加失败,请查看是否已登录');
                }
            },
            // error:function(err) {
            //     alert(1)
            //     // mui.toast('添加失败,请查看是否已登录');
            // }
        })
    })
})